<template>
    <div>
        <div class="history_title">最近搜索</div>
        <div class="history_list" v-for="(item,index) in historyList" :key="index">
            <span><i class="el-icon-time"></i></span>
            <span>{{item}}</span>
            <span><i class="el-icon-close"></i></span>
        </div>
    </div>
</template>
<script>
export default {
    props:['historyList']
}
</script>
<style>
.history_list{
    padding: 15px 12px;
    border-bottom: 1px solid #f2f2f2;
    font-size: 13px;
    color: #999;
    display: flex;
    flex-direction: row;
    justify-content: space-between
}
.history_title{
    font-size: 14px;
    color: #555;
    padding: 10px 10px 0 10px ;
}
.history_list span:nth-child(1){
    margin-right: 8px;
}
.history_list span:nth-child(2){
    flex-grow: 1;
}
</style>